<template>
	<view class="" style="height: 100%">
		<scroll-view scroll-y="true" class="scroll-Y" :refresher-triggered="triggered" refresher-background="#f4f7f8"
			:refresher-threshold="100" @scrolltolower="onPulling" refresher-enabled="true" @refresherrefresh="onRefresh"
			refresher-default-style="black">

			<slot name="default" :list="list">
				{{list}}
			</slot>

			<u-loadmore :status="status" />

			<view class="" style="height: 2rpx;">

			</view>
		</scroll-view>
	</view>
</template>

<script>
	import qs from "qs"
	export default {
		components: {},
		props: {
			seardata: {
				typeof: Object,
				default: () => {
					return {}
				}
			},
			api: {
				typeof: Function,
				default: async () => {
					return () => [];
				},
			},
			cmax: {
				typeof: [Number, String],
				default: 10,
			},
			onPullingfalge: {
				typeof: Boolean,
				default: true
			}
		},
		data() {
			return {
				status: "loadmore",
				triggered: false,
				list: [],
			};
		},
		computed: {
			reqdata() {
				let r = {
					...this.seardata
				};
				r.size = this.cmax;
				r.current = Math.ceil(this.list.length / r.size) + 1;

				// current=1&size=10
				return r;
			},
		},
		mounted() {
			if (this.onPullingfalge) {
				this.onPulling()
			}
		},
		methods: {

			async onPulling() {
				if (this.status == "loading") {
					return;
				}
				this.status = "loading";
				await this.getdata()
			},
			async onRefresh() {
				if (this.status == "loading") {
					return;
				}
				this.status = "loading";
				this.triggered = true;
				this.list = [];
			
				await this.getdata()
				this.triggered = false;
			},
			async getdata() {
				uni.showLoading();
				try{
					let reqdata = await this.api(this.reqdata);
					reqdata = reqdata?.data?.records || []
					this.list = this.list.concat(reqdata);
					this.status = reqdata.length >= this.reqdata.size ? "loadmore" : "nomore";
				}catch{
					this.status = "nomore";
				}
				
				
				uni.hideLoading();
			},
			itemtap(item) {
				if (item.b_end != "1") {
					uni.navigateTo({
						url: `/pages/ChargeUser/ChargeUser?${qs.stringify(item)}`
					})
				} else {
					uni.navigateTo({
						url: `/pages/order/ddxq/ddxq?${qs.stringify(item)}`
					})
				}
			},
		},
	};
</script>

<style lang="scss">
	.scroll-Y {
		height: 100%;
	}

	.carditem {
		background: #fff;
		margin: 30rpx;
		border-radius: 10rpx;

		.ddh {
			height: 100rpx;
			font-size: 30rpx;
			position: relative;
			padding: 0 30rpx;

			&::after {
				content: "";
				position: absolute;
				left: 30rpx;
				bottom: 0;
				height: 1rpx;
				background: #e5e5e5;
				right: 30rpx;
			}
		}

		.sj {
			height: 80rpx;
			font-size: 28rpx;
			position: relative;
			padding: 0 30rpx;

			&::after {
				content: "";
				position: absolute;
				left: 30rpx;
				bottom: 0;
				height: 1rpx;
				background: #e5e5e5;
				right: 30rpx;
			}
		}

		.je {
			height: 120rpx;
			justify-content: flex-end;
			padding: 0 30rpx;
			font-size: 24rpx;

			.text {
				font-size: 36rpx;
				font-weight: bold;
				color: #2093f5;
			}
		}
	}
</style>